<%= stylesheet_link_tag "webs", "side_left", "site_nav", "exp_way", "web-index" %>
<%= javascript_include_tag "webs", "changeImg/center_wrap",   "application" %>

<div id="notice" class="notice"><%= notice %></div>
<div class="middle">
<%#  %>
  <div class="wks-wrap clearfix">

    <div class="center-wrap">
      <%# **************************** picture toggle ********************** %>
      <div class="side-left inline-block vtop nomp" style="position: relative">
        <div id="imgsWrap" class="toggle-advs-wrap" style="left: -673px">
          <img src="/assets/index-adv1.png"/>
          <img src="/assets/index-adv2.png"/>
          <img src="/assets/index-adv3.png"/>
        </div>
        <div class="toggle-btns-wrap">
          <a href="###" class="toggle-btn inline-block cancel-loc" onmouseover="changeImg(1)" onmouseout="stopChange(1)">1</a>
          <a href="###" class="toggle-btn inline-block selected cancel-loc" onmouseover="changeImg(2)" onmouseout="stopChange(2)">2</a>
          <a href="###" class="toggle-btn inline-block cancel-loc" onmouseover="changeImg(3)" onmouseout="stopChange(3)">3</a>
        </div>
      </div>
      <%# **************************** 快速入口  **************************** %>
      <div class="shadow-4 inline-block"></div>
      <div class="exp-way inline-block vtop nomp">
        <div class="bill-search">
          <% if current_user.nil? %>
              <div style="height: 125px;">
                <div class="propagate-mdu "></div>
              </div>
              <div class="help-guest" style="width: 265px;margin: 0 auto;margin-top:13px;margin-bottom: 20px;">
                 <a href="/register" class="hg-regist"></a>
                <a href="/login" class="hg-login"> </a>
                <a href="/webs/contact_us" class="hg-help"></a>
              </div>
              <div class="bill-search-content">
                <span>提单查询</span>
                <img class="s-img" src="assets/search_lab.png"/>
                <input id="input-bl-no01" class="s-input vtop" name="billCode" onkeydown="SubmitKeyClick(this,event)"/>
                <a class="s-btn-query vtop inline-block" href="###" onclick="find_bl()"></a>
                <a class=" vtop inline-block" href="javascript:return;">&nbsp;<!-- 解决ie6无法居中的问题，实际为改元素的line-height为120，顶开了整个内容 --></a>
              </div>
          <% else %>
              <div class="block-nav">
                <h2>欢迎您</h2>
                <h2><%=current_user.login%></h2>
                <ul>
                  <li><%= link_to "个人信息", user_path(current_user) %></li>
                </ul>
              </div>
          <% end %>
        </div>
      </div>
    </div>
    <div class="product inline-block">
      <div class="pro-pic1 inline-block" style="background: url(/assets/pro_box.png);"></div>
      <div class="pro-title inline-block" style="background: url(/assets/pro_t_box.png);"></div>
      <div class="pro-mid">
        <div class="pro-text ellipsis">&nbsp;&nbsp;&nbsp;&nbsp;集装箱跟踪管理结合先进的GIS(全球<br/>空间分析即时技术)技术对集装箱进行跟踪定位，方便，高效，精确。
        </div>
      </div>
      <!--兼容IE6的CSS(IE6使用css1，只能对a标签使用hover伪类)，将原本对于pro-start的hover伪类，改为对于pro-start内a的伪类。-->
      <div class="pro-start ">
        <a href="/shipper_maps"></a>
      </div>
    </div>
    <div class="product product-middle inline-block">
      <div class="pro-pic2 inline-block" style="background: url(/assets/pro_car.png);"></div>
      <div class="pro-title inline-block" style="background: url(/assets/pro_t_car.png);"></div>
      <div class="pro-mid">
        <div class="pro-text ellipsis">&nbsp;&nbsp;&nbsp;&nbsp;车队运输过程管理采用即时通讯技术<br/>和地图位置跟踪服务，让您全方位掌握运输的每一个环节和步骤。</div>
      </div>
      <div class="pro-start ">
        <a href="/motorcade_maps/index"></a>
      </div>
    </div>
    <div class="product inline-block">
      <div class="pro-pic3 inline-block" style="background: url(/assets/pro_forward.png);"></div>
      <div class="pro-title inline-block" style="background: url(/assets/pro_t_forward.png);"></div>
      <div class="pro-mid">
        <div class="pro-text ellipsis">&nbsp;&nbsp;&nbsp;&nbsp;货代大管家，将基础数据维护和业务<br/>操作管理有机集成，兼顾操作便利性和协同性。</div>
      </div>
      <div class="pro-start ">
        <a href="/forward_maps"></a>
      </div>
    </div>
    <div class="product inline-block">
      <div class="pro-pic4 inline-block" style="background: url(/assets/pro_ship.png);"></div>
      <div class="pro-title inline-block" style="background: url(/assets/pro_t_ship.png);"></div>
      <div class="pro-mid">
        <div class="pro-text ellipsis">&nbsp;&nbsp;&nbsp;&nbsp;船公司管理系统，覆盖岸端的内部业<br/>务管理，又覆盖船舶端的业务管理，是为船公司提供标准的经营管理模式。
        </div>
      </div>
      <div class="pro-start">
        <a href="/shipowner_maps"></a>
      </div>
    </div>
  </div>

</div>
<div class="pro-detail" style="left: 100px; top: 200px; display: none; position:absolute; ">
  <div class="content-wrap"></div>
  <div class="pointer"></div>
</div>
<%# ******************************** footer ******************************** %>
